.head{
  width: 100%;
  height: 70px;
  background-color: white;

  box-shadow: 10px 10px 21px -3px rgb(231 231 231);

}

input{
  background:none;  
	outline:none;  
	border:0px;
}
button{
  
border: none;
background-color: transparent;
outline: none; 
}
.container{
  margin: 0 auto;
  width : 1240px;
  height: 100%;

}

.logoBox{
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 325px;
  height: 100%;
}

.logoimage{
  height: 40px;
  width: 40px;
}

.logoText{
  width: 151px;
  height: 27px;
}

.userBox{
  display: flex;
  align-items: center;
  height: 50px;
}
.userImage{
  width: 30px;
  height: 30px;
  background-color: skyblue;
  border-radius: 30px;
  overflow: hidden;
}
.userName{
  min-width: 120px;
  height: 30px;
  margin-left: 10px;
  line-height: 30px;
  font-weight: 900;
  color: rgb(140, 138, 138);

  font-size: 13px;
}

.backTocourse{
  cursor: pointer;
  width: 79px;
  height: 25px;
  background-color: rgb(208, 206, 206);
  border-radius: 25px;

  text-align: center;
  line-height: 25px;
  color: rgb(255, 254, 254);
  font-size: 13px;
}

.body{
  margin-top: 80px;
  width: 100%;
}

.container2{
  margin: 0 auto;
  width: 1020px;

}

.raceName{
  font-size: 24px;
  font-weight: bold;

  color: rgb(53, 53, 53);
}

.textBaoming{

  margin-top: 56px;

  height: 35px;
  border-left: 7px solid #22bfa7;

  line-height: 35px;

  font-size: 22px;
  font-weight: bold;
  color: #1ca18d;

  padding-left: 12px;
}
.searchGroup{
  margin-top: 30px;

  height: 40px;
}
.searchInput{
  width: 450px;
  height: 40px;

  border: 1px solid rgb(217, 217, 217);
  box-sizing: border-box;

  padding-left: 20px;

}

.searchButton{
  background-color: rgb(34,191,167);
  text-align: center;
  width: 70px;
  height: 40px;
  color: white;
  font-weight: bold;
}

.teamTitle{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  width: 100%;
  height: 80px;

  /* box-shadow: 10px 10px 10px 10px rgb(229, 229, 229); */
}
.title{
  cursor: pointer;
  width: 187px;
  height: 100%;
  text-align: center;
  line-height: 80px;

  color: rgb(203, 203, 203);
}

.leader{
  display: flex;
  align-items: center;


}

.joinRace{
  overflow:hidden;
            text-overflow:ellipsis;
            display:-webkit-box;
            /*控制在3行*/
            -webkit-line-clamp:1;
            -webkit-box-orient:vertical;
}

.join{

  height: 40px;
  background-color: rgb(34,191,167);
  line-height: 40px;
  color: white;
  border-radius: 8px;
}
.joined{
  background-color:rgb(210, 216, 215) ;
  color: #22bfa7;
}

.arrow{
  margin-top: 20px;
  display: flex;

  width: 360px;
  height: 50px;
}

.pageToNext,
.pageToLast{
  cursor: pointer;
  width: 100px;
  height: 31px;
  background-color: skyblue;
  text-align: center;
  line-height: 31px;

  color: white;
  font-size: 12px;
}
.pageToNext{
  margin-left: 20px;
}

.footer{
  margin-top: 20px;
  width: 100%;
  height: 400px;
  background-image: url(../image/Footer.png);
  background-size: 100% 100%;
}
.companyName{
  font-size: 15px;
  width: 291px;
}

.mask{
  position: absolute;
  top: 0;
  left: 0;

  width: 100%;
  height: 400px;
  background-color: rgba(0,0,0,0.5);
}

.createTeam{
  cursor: pointer;
  display: inline-block;
  width: 80px;
  height: 40px;
  background-color: deepskyblue;
  color: white;
  border-radius: 10px;
  text-align: center;
  line-height: 40px;
  font-weight: bold;
  margin-left: 353px;
  font-size: 14px;
}
